<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<style type="text/css">
			/*
			table是块元素
			*/
			table {
				width: 300px;
				margin: 0 auto;
				border: 1px solid black;
				/*
				table 和 td 边框之间默认有一个距离
				*/
				border-spacing: 0px;
				/*
				合并表格边框
				一旦设置了这个，那么border-spacing就无效了。
				边框会一直都是1px
				*/
				border-collapse: collapse;
				/* background-color: #bfa; */
			}

			th,
			td {
				border: 1px solid black;
				text-align: center;
			}

			/*
			这是选择偶数行
			even 偶数行
			odd 奇数行
			
			IE6 不支持
			*/
			tr:nth-child(even) {
				background-color: #bfa;
			}
			
			/*
			鼠标移动到哪一行，哪一行就改变颜色。
			
			IE6不支持对a之外的元素使用hover
			*/
			tr:hover{
				background-color: yellow;
			}
		</style>
	</head>
	<body>
		<!-- <table border="" cellspacing="" cellpadding=""> -->
		<table>
			<tr>
				<th>学号</th>
				<th>姓名</th>
				<th>性别</th>
				<th>住址</th>
			</tr>
			<tr>
				<td>1</td>
				<td>孙悟空</td>
				<td>男</td>
				<td>花果山</td>
			</tr>
			<tr>
				<td>2</td>
				<td>猪八戒</td>
				<td>男</td>
				<td>高老庄</td>
			</tr>
			<tr>
				<td>3</td>
				<td>沙和尚</td>
				<td>男</td>
				<td>流沙河</td>
			</tr>
			<tr>
				<td>4</td>
				<td>唐僧</td>
				<td>男</td>
				<td>女儿国</td>
			</tr>
		</table>
	</body>
</html>
